<!DOCTYPE html>
<html
		xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
		layout:decorate="shixi/include/layout"
>
	<head>
		<title>实习计划</title>
	</head>
	<body >
		<div class="content" layout:fragment="content">
			<div id="toolbar">
				<button class="btn btn-primary btn-sm" id="add" th:if="${session.s_sysUser.userType==1 or session.s_sysUser.userType==3}">
					<i class="fa fa-plus"></i>添加
				</button>
			</div>
			<table id="table"></table>
			<div id="addHtml" class="invisible">
				<form id="addForm">
					<div class="form-group row">
						<label for="classId" class="col-sm-2 col-form-label">班级</label>
						<div class="col-sm-10">
							<select name="classId" class="form-control" id="classId"></select>
						</div>
					</div>
					<div class="form-group row">
						<label for="studentUserId" class="col-sm-2 col-form-label">学生</label>
						<div class="col-sm-10">
							<select name="studentUserId" class="form-control" id="studentUserId"></select>
						</div>
					</div>
					<div class="form-group row">
						<label for="name" class="col-sm-2 col-form-label">名称</label>
						<div class="col-sm-10">
							<input type="text" name="name" class="form-control" id="name" placeholder="名称">
						</div>
					</div>
					<div class="form-group row">
						<label for="company" class="col-sm-2 col-form-label">公司</label>
						<div class="col-sm-10">
							<input type="text" name="company" class="form-control" id="company" placeholder="公司">
						</div>
					</div>
					<div class="form-group row">
						<label for="address" class="col-sm-2 col-form-label">地址</label>
						<div class="col-sm-10">
							<textarea  class="form-control" id="address" name="address"></textarea>
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-2 col-form-label">起止时间</label>
						<div class="col-sm-10">
							<div class="input-group input-daterange">
								<input type="text" class="form-control"  name="startDatetime" id="startDatetime">
								<div class="input-group-addon">至</div>
								<input type="text" class="form-control"  name="endDatetime" id="endDatetime">
							</div>
						</div>
					</div>
				</form>
			</div>
			<script type="text/javascript">
			var requestPage = pageInternshipProgram;
			var requestDetail = getInternshipProgram;
			var requestDelete = deleteInternshipProgram;
			var requestAdd = addInternshipProgram;
			var requestUpdate = updateInternshipProgram;
			var moduleName="实习计划"

		 	var $table = $('#table')
		 	function initDateTime(){
		 		$('.input-daterange input').each(function() {
					$(this).datepicker({
						format: 'yyyy-mm-dd',
						language: 'zh-CN'
					});
				});
		 	}
			//删除
			function remove(id){
				confirm("deleteModal","删除"+moduleName,"确认删除",function(){
					requestDelete(id,function(){
						$("#deleteModal").modal("hide")
						$table.bootstrapTable('refresh')
					})
				})
			}
			var addHTML;
			//修改
			function update(id){
				editModal("updateModal","修改"+moduleName,addHTML,function(){
					var data = getFormData($("#addForm"))
					requestUpdate({id:id,...data},function(res){
						$("#updateModal").modal("hide")
						$table.bootstrapTable('refresh')
					})
				},function(){
					initDateTime()
					initClassOptions(function(){
						initStudentOptions(function(){
							console.log("requestDetail")
							requestDetail(id,function(data){
								initFormValue($("#addForm"),data.data)
							})
						})
					})
				})
			}
			//添加
			function add(){
				editModal("addModal","添加"+moduleName,addHTML,function(){
					var data = getFormData($("#addForm"))
					requestAdd(data,function(res){
						$("#addModal").modal("hide")
						$table.bootstrapTable('refresh')
					})
				})
				initDateTime()
				initClassOptions()
				initStudentOptions()
			}

			//班级 options
			function initClassOptions(success){
				classSelect($("#classId"),function(){
					$("#classId").on("change",function(){
						var id=$(this).val()
						console.log(id)
						studentOptions($("#studentUserId"),{classId:id})
					})
					if (typeof success === "function") {
						success()
					}
				})

			}
			//学生 options
			function initStudentOptions(success){
				studentOptions($("#studentUserId"),{},success)
			}

		 	$(function(){
		 		addHTML = $("#addHtml").html()
		 		$("#addHtml").remove();
				$('#table').bootstrapTable({
				  ajax: function(params){
					var pageRequest = {
						pageNumber: params.data.offset/params.data.limit+1,
						pageSize: params.data.limit
					}
					requestPage(pageRequest,{search:params.data.search},function(data){
						params.success({rows:data.data.content,total:data.data.total})
					})
				  },
				  sidePagination:'server',
				  locale: "zh-CN",
				  pagination: true,
				  toolbar: "#toolbar",
				  search: true,
				  searchHighlight: true,
				  columns: [{
					field: 'name',
					title: '名称'
				  },{
					field: 'id',
					title: '编号'
				  }, {
					field: 'company',
					title: '公司'
				  }, {
					field: 'address',
					title: '地址'
				  }, {
					field: 'startDatetime',
					title: '开始时间'
				  }, {
					field: 'endDatetime',
					title: '结束时间'
				  }, {
					field: 'studentName',
					title: '学生名字'
				  }, {
					field: 'className',
					title: '班级名字'
				  }, {
					field: 'teacherName',
					title: '教师名字'
				  },
				  {
					title : '操作',
					field : 'id',
					align : 'center',
					formatter : function(value, row, index) {
						if(userType===1 ||userType===3){
							var e = '<a class="btn btn-primary btn-sm" href="javascript:void(0);" mce_href="#" title="编辑" onclick="update(\''
							+ row.id
							+ '\')"><i class="fa fa-edit"></i></a> ';
							var d = '<a class="btn btn-warning btn-sm" href="javascript:void(0);" title="删除"  mce_href="#" onclick="remove(\''
								+ row.id
								+ '\')"><i class="fa fa-minus"></i></a> ';
							return e + d;
						}
						return '';
					}
				  }],
				})
				$("#add").on("click",function(){
					add()
				})

			})
		</script>
		</div>
	</body>
</html>